<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

    <link rel="stylesheet" href="../../dist/mermaid.css"/>
    <script src="../../dist/mermaid.js"></script>
    <style>
        .cluster {
            fill: #fcac93;
            rx:4px;
            stroke: grey;
        }
        .cssClass > rect{
            fill:#FF0000;
            stroke:#FFFF00;
            stroke-width:4px;
        }
    </style>
    <link rel="stylesheet" href="../../dist/mermaid.forest.css"/>
</head>
<body>
<h1>classDef for circle and elipse</h1>
A node and D node should be green.
<div class="mermaid" id="i211">
    graph LR;
    A((start))-->B(step1);
    B-->C[step2];
    C-->D{step3};
    D-->D2(-step3.5-);
    D2-->E[end];
    classDef green fill:#9f6,stroke:#333,stroke-width:1px;
    class A,B,C,D,D2,E green;
</div>
</body>
</html>
